@import "../mixins.less";

.list-item {
    position: relative;
    padding: @list-padding-v @list-padding-h;
    font-size: @list-font-size;
    line-height: @list-line-height;
    // color: @color-black;
    &.padding-small {
        padding: (7px) (10px);
    }
    &.padding-large {
        padding: (12px) (14px);
    }

    .list-item-left {
        float: left;
        max-width: 60%;
    }
    .list-item-right {
        float: right;
    }
    .list-item-content {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .list-item-content.right {
        text-align: right;
    }

    .list-item.placeholder {
        .list-item-right {
            color: @third-font-color;
        }
        select {
            color: @third-font-color;
            option {
                color: @third-font-color;
            }
        }
    }

    // 应用在input上
    .list-input {
        background-color: @transparent-color;
        border: 0;
        // 删除原本样式
        height: auto;
        min-height: auto;
        appearance: none;
        -webkit-appearance: none;
        box-sizing: border-box;
        &.block {
            width: 100%;
        }
        // 内容局右
        &.right {
            text-align: right;
            // text-align-last: right;
            // text-align: -webkit-right;
        }
        &.two {
            height: 44px;
        }
        &::-webkit-input-placeholder {
            color: @third-font-color;
        }
    }
    select.list-input.right {
        direction: rtl;
        option {
            text-align: right;
            text-align-last: right;
            text-align: -webkit-right;
        }
    }

    // textarea的样式
    .list-item-textarea {
        width: 100%;
        font-size: 14px;
        line-height: 20px;
        border: 0;
        vertical-align: middle;
        resize: none;
    }
    .list-item-textarea-length {
        text-align: right;
    }
    .list-required {
        color: @color-red;
    }
    // select的样式
    .list-item-placeholder-select {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        opacity: 0;
    }
}

.switch-wrap {
    // hack
    height: 1rpx;
    transform: scale(0.7);
    transform-origin: right top;
    // .switch {
        //
    // }
}
